Color Picker
Description
The color picker is used to select colors for CSS properties, SVG Icons, etc.
Discussion
The color picker has several modes that make selecting colors a breeze.
The color picker also has support for semi transparent colors (when set into either 'rgba', 'hsla' mode).
In the image below, the 'Fan Decks' (like paint swatch sheets that you get from a paint store) allows you to select from a series of predefined colors.
On the left you can select any color and transparency that you want by dragging the sliders.
The selected color is shown in the rectangle at the top left.
In the top right corner of this rectangle a much smaller square is shown. This is the color that was originally selected when the color picker was first opened. It allows you to quickly switch back to the initial color by clicking on the color square.
In the Palettes mode (shown below) you can select from a palette of pre-defined colors that you define.
You can easily add a new color to the palette by selecting a color in the left hand pane and then clicking the + icon in the Palettes pane.
Another way to add a color to the palette (when the Palettes mode is not selected) is by clicking on the 
button in the left hand pane.
You can manage your palettes by clicking the down arrow icon in the Palettes mode
In the Image mode (shown below) you can load an image into the image picker and then select colors by pointing to different parts of the image.
You can set the mode in which the color picker works by clicking on the button (shown as HEX in the above image)
This brings up a menu showing the mode.
Inserting Colors in Xbasic and JavaScript
In addition to using the color picker to insert color values into CSS code and properties, you can also use the color picker to insert colors into your server- and client-side scripts. This is especially useful in the Javascript color properties for the SemiCircularNumberDisplay control or Kanban settings for a List layout.
In the JavaScript or Xbasic editor, right-click to open the context menu. Under Genies > Insert Color, select By HEX value... to open the Color Picker.
Select the color you would like to insert and click OK.
